{include file="public/header" /} {include file="public/menu" /}

<form class="layui-form" action="">
    <div class="layui-tab layui-tab-brief" lay-filter="demoTitle">
        <ul class="layui-tab-title site-demo-title">
            <li><a href="{:url('category/index')}">分类管理</a></li>
            <li class="layui-this"><a href="{:url('category/postdata')}">添加分类</a></li>
        </ul>
        <div class="layui-body layui-tab-content site-demo site-demo-body">
            <div class="layui-main">
                <!--子分类没有封面图-->
                {if !isset($pid)}
                    <div class="layui-upload" style="margin-top: 10px;">
                        <label class="layui-form-label">封面图</label>
                        <button  id="file_upload" style="margin-top: 10px;" type="button" class="layui-btn">点击上传(1920X200)</button ">
                    </div>
                    <div class="layui-upload" style="margin-top: 10px;">
                    </div>

                    <div class="layui-form-item">
                        <label class="layui-form-label"></label>
                        <div class="img">
                            {if isset($category_info['pic'])&&$category_info['pic']}
                            <img id="pic" height="100" src="{$category_info['pic']}" alt="">
                            {/if}
                        </div>
                    </div>
                {/if}

                <div class="layui-form-item">
                    <label class="layui-form-label">父级分类</label>

                    <div class="layui-input-inline">
                        <select name="pid" id="pid">
                            <option value="">请选择分类</option>
                            <option value="0" {if isset($category_info['pid'])&& $category_info['pid']==0} selected="" {/if} >一级分类</option>
                            {volist name="first_category" id="vo"}
                                <option value="{$vo.id}" {if isset($category_info['pid'])&& $category_info['pid']==$vo.id || isset($pid)&&$pid==$vo.id} selected="" {/if}>{$vo.name}</option>
                            {/volist}
                        </select>
                    </div>
                </div>


                <div class="layui-form-item">
                    <label class="layui-form-label">展现方式</label>

                    <div class="layui-input-inline">
                        <select name="type" id="type">
                            <option value="">请选择展现方式</option>
                            <option value="1" {if isset($category_info['type'])&& $category_info['type']==1} selected="" {/if} >文字列表</option>
                            <option value="2" {if isset($category_info['type'])&& $category_info['type']==2} selected="" {/if} >图片列表</option>
                            <option value="3" {if isset($category_info['type'])&& $category_info['type']==3} selected="" {/if} >视频列表</option>
                            <option value="4" {if isset($category_info['type'])&& $category_info['type']==4} selected="" {/if} >单篇文章</option>
                            <option value="5" {if isset($category_info['type'])&& $category_info['type']==5} selected="" {/if} >预约表单</option>

                        </select>
                    </div>
                </div>


                <div class="layui-form-item">
                    <label class="layui-form-label">分类名称</label>
                    <div class="layui-input-inline">
                        <input type="text" name="name" lay-verify="required" id="name" placeholder="请输入分类名称" autocomplete="off" class="layui-input" {if isset($category_info['name'])} value="{$category_info['name']}"  {/if} >
                    </div>
                </div>


                <div class="layui-form-item">
                    <label class="layui-form-label">排列顺序</label>
                    <div class="layui-input-inline">
                        <input type="text" name="displayorder" lay-verify="required" id="displayorder" placeholder="请输入排列顺序" autocomplete="off" class="layui-input" {if isset($category_info['displayorder'])} value="{$category_info['displayorder']}"  {/if} >
                    </div>
                </div>


                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示</label>
                    <div class="layui-input-block status">
                        <input type="checkbox" id="status" name="status" lay-skin="switch" lay-filter="switchTest" lay-text="是|否" {if isset($category_info['status'])&& $category_info['status']==0} {else} checked {/if}>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">导航栏显示</label>
                    <div class="layui-input-block is_nav">
                        <input type="checkbox" id="is_nav" name="is_nav" lay-skin="switch" lay-filter="switchTest" lay-text="是|否" {if isset($category_info['is_nav'])&& $category_info['is_nav']==0}  {else} checked {/if}>
                    </div>
                </div>

                <hr>
                <label class="layui-form-label"></label>
                <input name="id" id="id" type="hidden" {if isset($category_info['id'])}  value="{$category_info['id']}" {/if}>
                <button lay-filter="save" type="button" class="layui-btn  save">保存</button>

            </div>
        </div>
    </div>
</form>
<!-- 编辑器源码文件 -->
<script type="text/javascript">
    layui.use('upload', function(){
        var $ = layui.$
        var upload = layui.upload;
        //执行实例
        upload.render({
            elem: '#file_upload', //绑定元素
            url: "{:url('Common/upload')}", //上传接口
            accept:'image',
            done: function(res){
                console.log(res);
                var html='<img id="pic" height="100" src="'+res.filepath+'" alt="">';
                $('.img').html(html)
            },
            error: function(){
                layer.msg('上传失败');
            }
        });
    });

    layui.use(['layer', 'form'], function() {

        var $ = layui.$, //重点处
            layer = layui.layer,
            status,
            id=$('#id').val()?$('#id').val():0;

        $('.save').click(function(){
            var displayorder=$('#displayorder').val(),
                pid=$('#pid').val(),
                type=$('#type').val(),
                name=$('#name').val();
            if($('.status').find('.layui-unselect').hasClass('layui-form-onswitch')){
                status='1';
            }else{
                status='0';
            }

            if($('.is_nav').find('.layui-unselect').hasClass('layui-form-onswitch')){
                is_nav='1';
            }else{
                is_nav='0';
            }
            var pic=$("#pic").attr('src');

            $.ajax({
                type: "post",
                url: "{:url('category/postdata')}",
                data:{
                    'id':id,
                    'pic':pic,
                    'displayorder':displayorder,
                    'status':status,
                    'is_nav':is_nav,
                    'name':name,
                    'type':type,
                    'pid':pid
                },
                success: function(data) {
                    var res = JSON.parse(data);
                    if (res.status == '201') {
                        layer.msg(res.msg);
                    } else if (res.status == '200') {
                        location.href = '{:url("category/index")}';
                    }
                }
            });

        })
    });
</script>
{include file="public/footer" /}